<div class="goodsmanager">
	<div class="nav">
		<div class="nav-li focus">商品管理</div>
	</div>
	<hr />

	<div class="goods_list">
		{{#if $Cache.bus.goodsmanager.card_factory_list.length}}
			<div class="card-facotry-list">
				<span class="card-facotry-item">
					<a href="#admin/goodsmanager">公开的商品</a>
				</span>
				{{#each $Cache.bus.goodsmanager.card_factory_list}}
					<span class="card-facotry-item" title="{{info.intro}}">
						<a href="#admin/goodsmanager?card_factory_id={{_id}}">{{info.name}}</a>
					</span>
				{{/each}}
			</div>
		{{/if}}
		<div>空间：{{$Cache.bus.goods.page_info.total_num}}/{{bus_info.permission.data_max_goods_num||config.server_config.defaultMaxGoodsNum}}</div>
		
		<div class="search_box">
			<input bind-input="{{'$Cache.goodsmanager.search.text'}}" bind-value="{{$Cache.goodsmanager.search.text}}" placeholder="搜索" />
			<button class="btn" event-click="{{'$Event.goodsmanager.search'}}">搜索</button>
			<a href="#admin/goodsmanager">
				<button>全部</button>
			</a>
		</div>

		<table>
			<thead>
				<td class="logo">缩略图</td>
				<td class="name">名称</td>
				<td class="number">编号</td>
				<td class="price">价格</td>
				<td class="method">操作</td>
			</thead>
			{{#each goods}}
			<tr class="{{_is_draging?'dragging ':' '}}{{_dragenter_status}}" 
				event-dragover="{{'$Top.$Event.goodsmanager.dragover'}}"
				event-dragleave="{{'$Top.$Event.goodsmanager.dragleave'}}"
				event-dragenter="{{'$Top.$Event.goodsmanager.dragenter'}}">
				<td><img bind-src="{{preview_img_url}}?imageView/1/w/25/h/25" alt="{{goods_name}}的缩略图"></td>
				<td><a href="http://i-zhubao.com/goods_details.html?id={{_id}}" target="_blank">{{goods_name}}</a></td>
				<td>{{_id}}</td>
				<td>{{price}}</td>
				<td>
					<button event-click="{{'$Top.$Event.remove_goods'}}" class="delete">删除</button>
					<button event-click="{{'$Top.$Event.update_goods'}}" class="delete">修改</button>
					<button title="置顶" event-click="{{'$Top.$Event.to_top'}}">置顶</button>
					<!-- <button title="上移" event-click="{{'$Top.$Event.to_up'}}" class="icon-arrow-up"></button>
					<button title="下移" event-click="{{'$Top.$Event.to_down'}}" class="icon-arrow-down"></button> -->
					<button title="拖动排序" draggable class="icon-move"
						event-dragstart="{{'$Top.$Event.goodsmanager.dragstart'}}" 
						event-dragend="{{'$Top.$Event.goodsmanager.dragend'}}" 
					> </button>
				</td>
			</tr>
			{{/each}}
		</table>

		<pagination
		 id="turn-page"
		 page-info="$Cache.bus.goods.page_info"
		 ></pagination>
	</div>
	
</div>
<style>
	.dragging{
		position:relative;
		opacity:0.4;
	}
	.dragenter-status-before{
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.35) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.35))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* IE10+ */
background: linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* W3C */

		-webkit-box-shadow: 0px 3px 10px #000000!important;
		-moz-box-shadow: 0px 3px 10px #000000!important;
		box-shadow: 0px 3px 10px #000000!important;
		-webkit-transform: perspective(500px) rotateX(-30deg)!important;
		-moz-transform: perspective(500px) rotateX(-30deg)!important;
		-o-transform: perspective(500px) rotateX(-30deg)!important;
		-ms-transform: perspective(500px) rotateX(-30deg)!important;
		transform: perspective(500px) rotateX(-30deg)!important;
	}
	.dragenter-status-after{
background: -moz-linear-gradient(top, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.35)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
background: linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* W3C */
		-webkit-transform: perspective(500px) rotateX(30deg)!important;
		-moz-transform: perspective(500px) rotateX(30deg)!important;
		-o-transform: perspective(500px) rotateX(30deg)!important;
		-ms-transform: perspective(500px) rotateX(30deg)!important;
		transform: perspective(500px) rotateX(30deg)!important;
	}
</style>